class MVVM {
  constructor(config) {
    this.$data = config.data;
    this.methods = config.methods;
    this.$el = config.el;

    Object.keys(this.$data).forEach((key) => {
      this.dataProxy(key);
    });

    this._Observe(this.$data);
  }

  dataProxy(key) {
    let that = this;
    Object.defineProperty(that, key, {
      set(newVal) {
        if (newVal === this.$data[key]) return;
        this.$data[key] = newVal;
      },
      get() {
        return this.$data[key];
      },
    });
  }

  _Observe(data) {
    let handler = {
      get(target, name) {
        let item = target[name];
        if (typeof item === "object") {
          return new Proxy(item, handler);
        }
        return item;
      },
      set(target, name, newVal) {
        if (target[name] === newVal) return;
        console.log("数值更新");
        target[name] = newVal;
        return true;
      },
    };

    this.$data = new Proxy(data, handler);
  }
}

class Dep {
  constructor() {}
}

class Watcher {
  // node.innerHtml = this.$data["name"];
  // el是 nide ;vm 是 this;keys 是所有的属性；type其实是”name";
  constructor(el, vm, keys, type) {
    
  }
}
